<template>
  <div class="footer-body">
    <div class="login-bloock" v-if="showlogin">
      <loginpop @bindlogin="loginbloock"></loginpop>
    </div>
    <div class="footer-content">
      <div class="footer-tab mobile-top">
        <div class="foottab-block">
          <li class="tabtext" @click="cpryrightBtn">版权声明</li>
          <li class="tabtext" @click="contactBtn">联系我们</li>
          <li class="tabtext noline">合作伙伴</li>
          <div class="clear"></div>
        </div>
      </div>
      <div class="footer-tab pc-bk">
        <div class="footer-block-top">
          <div class="foottab-block">
            <div class="friendly-link-category">
              <div class="link-category-list" @click="checkLink" v-for="(link, index) in linkleft" :data-index="index">
                <div v-if="link.links.length > 0">
                  <div class="link-category-name" v-bind:class="{'active': index === lefttab}">
                    {{link.position}}
                  </div>
                </div>
                <div v-else>
                  <div class="link-category-name" v-bind:class="{'active': index === lefttab}">
                    {{link.position}}
                  </div>
                </div>
              </div>
            </div>
            <div class="friendly-link-list contact" v-if="positonkey === 'contactus'">
              <span class="text">
                国际金融论坛（IFF)<br>
                <!-- 电话：8610-68005887<br> -->
                电子邮件：iff@iff.org.cn
              </span>
              <!-- <span class="mapimg">
                <img src="../../../img/mobile/map.jpeg">
              </span> -->
            </div>
            <div class="friendly-link-list contact" v-else-if="positonkey === 'other'">
              <span class="text">
                国际金融论坛（IFF）欢迎来自社会各界精英的建议和意见，如果您对我们有任何建议和意见，请立即与我们取得联系：E-Mail: iff@iff.org.cn
 <br>
有关职业发展、招聘岗位、交流访问、实习机会等相关事宜，请将您的简历发送至<br>
电子邮件：hr@iff.org.cn
              </span>
            </div>
            <div class="friendly-link-list" v-else>
              <a :href="links.link" v-for="(links, lindex) in linksleft">
                <span>{{links.name}}</span>|
              </a>
            </div>
           <!--  <li class="tabtext" @click="cpryrightBtn">版权声明</li>
            <li class="tabtext" @click="contactBtn">联系我们</li>
            <li class="tabtext">合作伙伴</li>
            <li class="tabtext noline">下载中心</li>
            <div class="clear"></div> -->
          </div>
          <div class="footer-share">
            <div class="friendly-link-category">
              <div class="link-category-list"  v-for="(linkrights, index) in linkright" :data-index="index">
                <div v-if="linkrights.links.length > 0" @click="checkRgLink"  :data-link="linkrights.links[0].link">
                  <div class="link-category-name">
                    {{linkrights.position}}
                  </div>
                </div>
               <!--  <div v-else-if="linkrights.key === 'login'">
                  <div class="link-category-name"  @click="openLogin">
                    {{linkrights.position}}
                  </div>
                </div> -->
                <div v-else>
                  <div class="link-category-name">
                    {{linkrights.position}}
                  </div>
                </div>
              </div>
            </div>
            <div class="share-qrcode">
              <!-- <div class="share-img-list">
                <img src="../../../img/mobile/share-icon-wb.jpg">
                <div class="gfwb">官方微博</div>
              </div> -->
              <div class="share-img-list">
                <img src="../../../img/mobile/share-icon-wx.jpg">
                <div class="gfwb">官方微信</div>
              </div>
              <div class="share-img-text">
                <a href="https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MzA4NDAwMDEwNQ==&scene=124#wechat_redirect">
                  <span><img style="margin-bottom: 3px;" src="../../../img/mobile/link-foot-share1.png"> 微信</span>
                </a>
                <a href="https://weibo.com/ifforum">
                <span><img style="margin-bottom: 3px;" src="../../../img/mobile/link-foot-share2.png"> 微博</span>
                </a>
                <!-- <a href="">
                <span><img style="margin-bottom: 3px;" src="../../../img/mobile/link-foot-share3.png"></span>
                </a>
                <a href="">
                <span><img style="margin-bottom: 3px;" src="../../../img/mobile/link-foot-share4.png"></span>
                </a> -->
              </div>
            </div>
            <!-- <span>分享</span>
            <span class="share-icon"><img src="../../../img/mobile/xl.png" alt=""></span>
            <span class="share-icon"><img src="../../../img/mobile/wx.png" alt=""></span>
            <span class="share-icon"><img src="../../../img/mobile/fc.png" alt=""></span>
            <span class="share-icon"><img src="../../../img/mobile/tw.png" alt=""></span> -->
          </div>
        </div>
      </div>
      <div class="footer-copyright" style="display: none;">
        <img src="../../../img/mobile/footer.jpg">
      </div>
      <div class="footer-copyright">
        <div class="footer-logo">
          <img src="../../../img/mobile/footerlogo.png">
        </div>
        <div>
          Copyright © IFF. All screenshots © their respective owners.
        </div>
       <!-- <div>
          上海XX有限公司
        </div>-->
        <div class="record-num">
          <img src="../../../img/mobile/ghs.png" alt="">京ICP备18026906号
          <div>
            版权所有 © 国际金融论坛
          </div>
        </div>
      </div>
    </div>
    </div>
</template>
<script>
import helper from '../../../utils/helper'
import api from '../../../utils/api'
import apiConfig from '../../../utils/apiconfig.js'
import loginpop from '../components/login'
export default {
  data () {
    return {
      showlogin: false,
      linkleft: '',
      linkright: '',
      lefttab: 0,
      linksleft: [],
      thisposition: '',
      captchakey: '',
      codeurl: ''
    }
  },
  components: {
    loginpop
  },
  created () {
    this.getlinklist(0)
    if (!localStorage.captchakey || !localStorage.codeurl) {
      this.getcaptchakey()
    }
  },
  methods: {
    loginbloock (val) {
      this.showlogin = val
    },
    openLogin () {
      if (localStorage.token && localStorage.token !== '') {
        this.$notify({
          title: '提示',
          message: '您已登录，无需再次登录',
          type: 'info',
          duration: 1500
        })
      }
      else {
        this.showlogin = true
      }
    },
    getcaptchakey () {
      var that = this
      var param = {
        type: 'captcha'
      }
      api.GET(helper.getClientApiUrl(apiConfig.web.captchakey), param, res => {
        that.captchakey = res.captcha_key
        that.codeurl = res.url
        localStorage.setItem('captchakey', res.captcha_key)
        localStorage.setItem('codeurl', res.url)
        console.log(res.url)
      }, res => {
        console.log(res)
      })
    },
    checkLink (e) {
      var linkid = e.currentTarget.dataset.index
      this.linksleft = this.linkleft[linkid].links
      this.thisposition = this.linkleft[linkid].position
      this.positonkey = this.linkleft[linkid].key
      this.lefttab = parseInt(linkid)
    },
    checkRgLink (e) {
      window.open(e.currentTarget.dataset.link)
    },
    cpryrightBtn () {
      this.$router.push('/home/copyright')
    },
    contactBtn () {
      this.$router.push('/home/contactus')
    },
    getlinklist (num) {
      var that = this
      var param = {
        position: 'bottom'
      }
      this.params = param
      api.GET(helper.getClientApiUrl(apiConfig.web.footerlink), this.params, res => {
        that.linkleft = res.left
        that.linkright = res.right
        that.linksleft = that.linkleft[num].links
        that.thisposition = that.linkleft[num].position
        that.positonkey = that.linkleft[num].key
        console.log(that.linkright)
        console.log(that.linkleft)
      }, res => {})
    }
  }
}
</script>
